<template>
    <!--<div class="el-message-box__wrapper" style="z-index: 2100">-->
      <!--<div class="el-message-box">-->
        <!--<div class="el-message-box__header">-->
          <!--<div class="el-message-box__title">-->
            <!--<span>分享文件</span>-->
          <!--</div>-->
          <!--<button type="button" aria-label="Close" class="el-message-box__headerbtn" @click="close">-->
            <!--<i class="el-message-box__close el-icon-close"></i>-->
          <!--</button>-->
        <!--</div>-->
        <!--<div class="el-message-box__content">-->
          <!--<div class="el-message-box__message">-->
            <!--<p>{{$parent.shareName}}</p>-->
          <!--</div>-->
        <!--</div>-->
        <!--<div class="el-message-box__btns"><button @click="close" type="button" class="el-button el-button&#45;&#45;default el-button&#45;&#45;small">&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;<span>-->
          <!--取消-->
        <!--</span></button><button @click="share" type="button" class="el-button el-button&#45;&#45;default el-button&#45;&#45;small el-button&#45;&#45;primary ">&lt;!&ndash;&ndash;&gt;&lt;!&ndash;&ndash;&gt;<span>-->
          <!--确定-->
        <!--</span></button></div>-->
      <!--</div>-->
    <!--</div>-->
  <GlobalDialog :dialogOptions="dialogOptions1" @close="close" @submit="share">
    <div class="el-message-box__input" style="height: 89px;">
      <el-col :span="12">
        <span style="color: red;">*</span><span style="color: #999;margin-right: 12px;">{{diskType==='1'?'姓名':'部门'}}:</span>
        <el-autocomplete
          ref="input"
          popper-class="my-autocomplete"
          class="inline-input"
          v-model="state2"
          :fetch-suggestions="querySearch"
          placeholder="请输入"
          @select="handleSelect"
        >
          <template slot-scope="{ item }">
            <div class="name">{{ item.username }}</div>
            <span class="addr">{{ item.deptName }}</span>
          </template>
        </el-autocomplete>
      </el-col>
    </div>
  </GlobalDialog>
</template>

<script>
import GlobalDialog from '@/components/tools/GlobalDialog'
import {postAction} from '@/api/manage'

export default {
  name: "Search",
  props: ['dialogOptions1','fileList','diskType'],
  data(){
    return {
      restaurants: [],
      isLoad: false,
      state2: '',
      shareUserid: '',
      shareName: '1',
      callback: null,
      shareName1: '',
    }
  },
  methods:{
    share () {
      if(this.shareName!==this.state2){
        this.$message({
          type: 'warning',
          message: '请检查输入是否正确'
        });
        return
      }
      const list = this.fileList.filter(item => item.isActive === true)
      const shareUserid = this.shareUserid
      list.forEach(item=>{
          // if(item.fileType==='folder'){
          //   this.$message({
          //     type: 'warning',
          //     message: '不支持分享文件夹'
          //   });
          // }else {
            this.$message({
              type: 'success',
              message: '分享成功'
            });
            postAction('/dailyOffice/netDisk/share',{netdiskId: item.id,shareUserid})
            item.shareList.push({shareUsername:this.shareName1,shareTime:'24:00:00'})
          // }
        })
      this.close()
    },
    close () {
      this.$parent.dialogOptions1.dialogStatus = false
      this.state2 = ''
    },
    querySearch(queryString, cb) {
      var restaurants = this.restaurants;
      console.log(restaurants)
      var results = queryString ? restaurants.filter(this.createFilter(queryString)) : restaurants;
      // 调用 callback 返回建议列表的数据
      if(this.isLoad){
        cb(results);
      } else {
        this.callback = cb
      }
    },
    createFilter(queryString) {
      return (restaurant) => {
        return (restaurant.username.indexOf(queryString) === 0);
      };
    },
    loadAll() {
      return [
        { "value": "张三", "address": "国税局" },
        { "value": "李四", "address": "法院" },
        { "value": "王五", "address": "检察院" },
      ];
    },
    handleSelect(item) {
      this.shareUserid = item.id
      this.state2 = item.username
      // this.state2 = item.username+'('+item.deptName+')'
      this.shareName = this.state2
      this.shareName1 = item.username
    },
    getData(){
      this.axios.get('/dailyOffice/netDisk/getAllUserList',{params:{diskType:this.$parent.diskType}}).then(res=>{
        const data = res.result
        data.forEach((item,index)=>{
          !item.username && data.splice(index,1)
        })
        this.restaurants = data
        this.$refs.input.focus()
        this.isLoad = true
        this.callback&&this.callback(data)
      })
    }
  },
  mounted() {
    this.getData()
  // this.restaurants = this.loadAll();
  // this.$refs.share.focus()
},
  components: {
    GlobalDialog
  },
}
</script>

<style lang="scss">
  .el-popper{
    z-index: 20900!important;
  }
  .my-autocomplete {
  li {
    line-height: normal;
    padding-top: 7px;
    padding-bottom: 7px;

  .name {
    text-overflow: ellipsis;
    overflow: hidden;
  }
  .addr {
    font-size: 12px;
    color: #b4b4b4;
  }

  .highlighted .addr {
    color: #ddd;
  }
  }
  }
  .el-autocomplete-suggestion__wrap {
     max-height: 280px;
     padding: 10px 0 26px;
     box-sizing: border-box;
   }

</style>
<style scoped>
  .inline-input{
    width: 230px;
  }
  .el-col-12 {
    width: 100%;
    text-align: center;
  }
</style>
